Testing

Back to Documentation Intro Contents

Testing

• Testing in Next.js and React
• Review the testing resources saved in Todoist
• Set up testing throughout the application based on its requirements
• Testing Trophy and Testing Classifications
  • Static tests (ESLint, TypeScript) - Done automatically in VS Code e.g. typos and type errors
  • Unit tests (Jest / Vitest / React Testing Library)
  • Integration tests (React Testing Library / Cypress)
  • E2E tests (Playwright / Cypress)
    • E2E Playwright testing with Next.js
    • Ultimate Guide to Visual Testing with Playwright
• Use AI to write some simple tests

Static Tests

• Static tests are done automatically in VS Code e.g. typos and type errors
• Ensure static testing libraries are set up such as ESLint or TypeScript

Unit Tests

• To create unit tests, use AI to write the tests - see the "Testing Prompts" section of the Obsidian note on AI Prompts - and then review the tests and make improvements
• Use a testing library such as Jest or React Testing Library
• If using Vite, use Vitest for unit tests

Integration Tests

• To create integration tests, use AI to write the tests - see the "Testing Prompts" section of the Obsidian note on AI Prompts - and then review the tests and make improvements
• Use a testing library such as React Testing Library or Cypress

E2E Tests

• For E2E tests, use a testing library such as Playwright or Cypress

Performance Testing

• Before releasing the project, test the performance of the project using these tools:
  • Lighthouse - Chrome DevTools extension
  • WebPageTest - Lets you test the performance of your site across multiple locations and devices
  • PageSpeed Insights - Chrome DevTools extension